<template>
    <div id="search">
        <head-tip title='搜索结果' :isback=true></head-tip>
        <section class="content">
            <scroller snappingHeight="10" class="scroller" :on-refresh="refresh" :on-infinite="infinite" ref="my_scroller">
                <ul id="dataList" class="data-list" v-cloak>
                    <li v-for="(item,index) in dataList" class="cards-one" :key="index"  @click="gotoUrl(item.id,item.uid,item.itype)">
                        <p class="left-pic"><img :src="item.cplogo"><span v-if="item.cplogo == './static/image/h4.jpg'">{{item.cname.substr(0,1)}}</span></p>
                        <p class="right-name-age">
                            <label v-if="$route.query.itype == 1">{{item.cname}}<i class="iconfont icon-renzheng" :class="{nocertcolor:!item.bcredit}"></i><span class="hangye">&nbsp;&nbsp;&nbsp;{{item.cindustry}}</span></label>
                            <label v-else>{{item.ccompany}}<i class="iconfont icon-renzheng" :class="{nocertcolor:!item.bcredit}"></i></label>
                            <span style="display:flex;font-size:0.8rem">
                                <span class="ctime"></span>
                                <span class="money" style=" display: block; background: #eee; border-left: solid 2px #00AA76; padding-left: 5px; padding-top: 2px; padding-bottom: 2px; margin-top: 5px;">贴主：{{item.crealname}}</span>                                
                            </span>
                            <span style="display:none;font-size:0.8rem; width: 100%;">
                            	<span class="money">等级：{{item.cusergrade}}</span>
                                <span class="money">阿斗币：{{item.iuserscore}}</span>
                                <span class="money">活跃度：{{item.icardscore}}</span> 
                            </span>
                            
                            <span class="address">{{item.alladdress}}</span>
                        </p>
                    </li>
                </ul>
            </scroller>
        </section>
    </div>
</template>

<script>
import headTip from '@/components/common/head'
import {baseUrl} from '@/config/env.js'
import {getAllCardList} from './index.js'
export default {
    data () {
      return {
        isActive:true,//控制是否开启activated
        pageNo:1,
        dataList:[],
        findContent:'',
        itype:'',
        baseUrl:baseUrl,
        doneSome:'',//done的容器
      };
    },
    methods:{
        gotoUrl(id,uid,itype){
            if(itype==0){
                this.$router.push({path:"/card/companyCard",query:{id:id,uid:uid}})
            }else{
                this.$router.push({path:"/card/personCard",query:{id:id,uid:uid}})
            }
        },
        infinite(done,isrefresh) {
            let self = this;
            let sendData = {
                pageNo:self.pageNo,
                pageSize:10,
                findContent:self.findContent,
                itype:self.itype
            }
            let responseData = getAllCardList(sendData);
            responseData.then((res)=>{
                                    if(res.data && res.data.list.length>0){
                                        
                                        let items = res.data.list;
                                        items.forEach( (item,key) => {
                                            
                                            if(item.cplogo){
                                                item.cplogo = self.baseUrl+item.cplogo
                                            }else{
                                                item.cplogo = './static/image/h4.jpg'
                                            }
                                            if(item.cprovince!='请选择'){
                                                item.alladdress=item.cprovince+item.ccity+item.cdistrict+item.caddress
                                            }else{
                                                item.alladdress=''
                                            }
                                            if(!item.bcredit){
                                                item.creditclass='nocertcolor'
                                            }else{
                                                item.creditclass=''
                                            }
                                            self.dataList.push(item)
                                        })
                                        if(isrefresh){
                                            self.dataList = items;
                                        }
                                        self.pageNo++;
                                        done();
                                        self.doneSome = done;
                                        
                                    }else{
                                        self.$refs.my_scroller.finishInfinite(2);
                                    }
                                })
        },
        refresh(done) {
            let isrefresh = true;
            this.pageNo = 1;
            this.infinite(done,isrefresh);
            done();
        },
    },
    components:{
        headTip
    },
    mounted(){
        this.isActive = false
        this.findContent=this.$route.query.text;
        this.itype=this.$route.query.itype?this.$route.query.itype:'';
    },
    activated(){
        if(this.isActive){
            let curItype = this.$route.query.itype;
            let curContent = this.$route.query.text;
            if(curItype != this.itype || curContent!=this.findContent){//初始化
                this.findContent=this.$route.query.text;
                this.itype=curItype?this.$route.query.itype:'';
                this.$refs.my_scroller.triggerPullToRefresh();
            }
        }else{
            this.isActive = true
        }
    }
}
</script>

<style scoped>

    .content{
        position: absolute;
        width: 100%;
        top: 3rem;
        bottom: 0;
    }

	.cards-one{display:block;overflow:hidden;margin:auto;width:96%;height:auto;border-bottom:solid .05rem #ddd; padding: 2% 0%;}
.money{ padding-right: 1rem;}
	.cards-one p.left-pic{display:block;width:3rem;height:3rem;float:left;margin-top:1.3rem}
    .cards-one p.left-pic img{width:100%;height:100%;border-radius:100px}
    .cards-one p.right-name-age{display:block;float:left;width:80%;height:auto;padding-left:1.5rem;padding-top:0.5rem; overflow: hidden; padding-bottom: .5rem;}
    .cards-one p.right-name-age label{display:block;font-size:1rem;font-weight:400;line-height:1.5rem;text-align: left;}
    .cards-one p.right-name-age label i{color:#01AB77;padding-left:.2rem}
    .cards-one p.right-name-age span.address{display:inline-block;float:left;font-size:.8rem;color:#666;padding-top:.4rem}
    .cards-one p.right-name-age label i.nocertcolor{color:#ccc}
    .left-pic{
        position: relative;
    }
    .left-pic span{
        position:absolute;
        top:0;
        left: 0;
        height: 3rem;
        text-align: center;
        line-height: 3rem;
        font-size:1.5rem;
        width:100%;
        color:#ffffff;
    }
</style>
